<%--
  Created by IntelliJ IDEA.
  User: 86177
  Date: 2020/8/12
  Time: 10:04
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>小米商城 - 小米10 Pro、Redmi 10X、小米MIX Alpha，小米电视官方网站</title>
</head>
<!--标题图标-->
<link rel="icon" href="/images/homepage/favicon.ico">
<!--全局样式-->
<link rel="stylesheet" href="/static/css/reset.css">
<!--字体图标-->
<link rel="stylesheet" href="//at.alicdn.com/t/font_1981790_zwewl19ropp.css">
<link rel="stylesheet" href="/static/layui/css/layui.css">

<style>
    /*基本样式*/

    body {
        text-align: center;/*设置所有标签的内容水平居中*/
        color: #333333;
    }

    a {
        text-decoration: none;
    }

    input, button, img {
        border: none;
        vertical-align: middle;
    }

    h1, h2, h3, h4, h5, h6 {
        font-weight: normal;
    }

    li {
        list-style-type: none;
    }

    /*黑色导航栏start*/
    /*left start*/
    .black-nav {
        width: 100%;
        height: 40px;
        line-height: 40px;
        background-color: #333333;
        font-size: 12px;
    }
    .wrap{
        width: 1226px;
        margin: 0 auto;
    }
    .black-nav-left{
        float: left;
    }
    .black-nav li{
        float: left;
        position: relative;
    }
    .black-nav a{
        color: #b0b0b0;  /*设置字体颜色用color，而不是font-color*/
        /*字体大小 .black-nav*/
        /*字体垂直居中 .black-nav*/
    }
    .black-nav a:hover{
        color: #ffffff;
    }
    .black-nav span{
        margin: 0 6px;
        color: #424242;
    }
    .download {
        width: 124px;
        height: 150px;
        background-color: white;
        position: absolute; /*不占据父元素位置，就不会撑开父元素 相对于父元素li  position: relative;*/
        /*水平居中对齐*/
        top: 40px;
        left: 50%;
        margin-left: -62px;
        /*阴影*/
        box-shadow: 0 1px 5px rgb(170, 170, 170); /*水平为0，垂直为1 模糊度5px*/
        /*设置内边距*/
        padding: 18px 0 14px;
        /*避免因为内边距撑大盒子*/
        box-sizing: border-box;
        /*隐藏download*/
        display: none;
    }
    /*鼠标悬停在download上让二维码显示出来*/
    .black-nav li:hover>.download{ /*有子元素download的li*/
        display: block;
        z-index: 999;
    }
    .download>img {
        width: 90px;
        height: 90px;
    }
    .download>p{
        font-size: 14px;
        color: #333333;
        margin-top: 14px;
        line-height: 14px;
    }
    /*left end*/
    /*right start*/
    .black-nav-right{
        float: right;
    }
    .shopping-car{
        width: 120px;
        height: 40px;
        background-color: #424242;
        font-size: 14px;
        /*鼠标小手*/
        cursor: pointer;
        position: relative;
    }
    .shopping-car:hover{
        background-color: #ffffff;
        /*color: #ff6700;*/   /*shopping-car里面有a标签，而a的字体颜色是不继承的，所以需要单独设置a的悬停样式*/
        z-index: 999;
    }
    .shopping-car:hover>a{
        color: #ff6700;
    }

    .cart{
        width: 316px;
        height: 0px;
        /*line-height: 98px;!*垂直居中*!*/
        box-sizing: border-box;
        background-color: #ffffff;
        /*绝对定位，父元素shopping-car相对定位*/
        position: absolute;
        top: 40px;
        right: 0px;
        /*设置阴影*/
        box-shadow: 0 2px 10px rgba(0,0,0,.15);
        color: #424242;
        overflow: hidden;
        transition: all 1s;
        /*这里不使用display：none是因为它不能实现过渡效果*/
    }
    /*实现过渡弹出动画*/
    /*
    1.将cart高度设置为0,溢出部分隐藏,在设置一下过渡时间
    2.悬停时再将高度设置为98px，字体垂直居中
    */
    .shopping-car:hover>.cart{
        height: 98px;
        line-height: 98px;
    }
    /*right end*/
    /*黑色导航栏end*/

    /*白色导航start*/
    .white-nav{
        width: 100%;
        height: 100px;
        line-height: 100px;  /*垂直居中*/
        background-color: white;
        position: relative;
    }
    .logo{
        float: left;
        width: 55px;
        height: 55px;
        margin-top: 22.5px;
    }
    .logo2 {
        float: left;
        width: 165px;
        height: 55px;
        margin-top: 22.5px;
        margin-left: 10px;
    }

    .white-nav ul{
        float: right;
    }
    .white-nav li{
        float: left;
        /*内容垂直居中*/
    }
    .white-nav a{
        color: #333333;
        padding: 0 10px;
    }
    .white-nav a:hover{
        color: #ff6700;
    }
    .white-nav .box{
        margin-top: 25px;
        margin-left: 25px;
    }
    .white-nav input{
        width: 245px;
        height: 50px;
        border: 1px solid #e0e0e0;
        /*设置内边距*/
        padding: 0 10px;
        /*避免盒子被撑开*/
        box-sizing: border-box;
        /*去除外边框*/
        outline: none;
        float: left;
        border-right: none;
    }
    .white-nav input:hover{
        border-color: #b0b0b0;/*悬停边框变色*/
    }

    .white-nav button{
        width: 52px;
        height: 50px;
        border: 1px solid #e0e0e0;
        background-color: #ffffff;
        outline: none;
        float: left;
        /*设置动态变色*/
        transition: all 0.5s;
    }

    .white-nav button:hover{
        background-color: #ff6700;
        color: #ffffff;
        cursor: pointer;/*变小手*/
        border-color: #b0b0b0;/*悬停边框变色*/
    }

    /*非过渡动画*/
    .white-nav .nav-select{
        width: 100%;
        height: 229px;
        /*    height: 0px;*/
        border-top: 1px solid #e0e0e0;
        background-color: white;
        /*相对定位 white-nav：position: relative;*/
        position: absolute;
        left: 0;
        top: 100%;
        /*阴影*/
        box-shadow: 0 3px 4px rgba(0,0,0,.18);
        display: none;
        /*    !*过渡动画*!
            overflow: hidden;
            transition: all 0.5s;*/

    }
    .white-nav li:hover>.nav-select{
        display: block;
        /*    height: 229px;*/
        z-index: 999;
    }
    .nav-select ul{
        float: left;
        margin-left: 350px;
    }

    .nav-select li{
        width: 204px;
        padding: 0 12px;
        box-sizing: border-box;
    }

    .nav-select img{
        width: 160px;
        margin-top: 25px;

    }

    .title,.price{
        font-size: 12px;
        height: 20px;
        line-height: 20px;
    }

    .nav-select .price{
        color: #ff6700;
    }
    /*白色导航end*/

    /*轮播图开始*/
    .carousel{
        width: 100%;
        height: 460px;
    }
    /*.layui-carousel {
        width: 100%;
        height: 460px;
    !*!*    background-size: 100%;*!

        width: 978px;
        min-height: 1px;
        float: left;
        height: 340px;*!
    }*/

    #test2{
        width: 1266px;
        margin: 0 auto 0 -10px;
        height: 100%;
        background-size: 100%;
        float: left;
        box-sizing: border-box;
    }

    /*.carousel{
        width: 100%;
        height: 460px;
    }
    .carousel-box{
        width: 100%;
        height: 460px;
        background-image: url("../../static/images/c1.jpg");
        background-size: 100%;
        -webkit-animation: carousel 15s infinite linear;
    }
    @-webkit-keyframes carousel {
        0%{
            background-image: url("../../static/images/c1.jpg");
        }
        25%{
            background-image: url("../../static/images/c2.jpg");
        }
        50%{
            background-image: url("../../static/images/c3.jpg");
        }
        75%{
            background-image: url("../../static/images/c4.jpg");
        }
        100%{
            background-image: url("../../static/images/c5.jpg");
        }
    }*/

    .door{
        width: 234px;
        height: 420px;
        background-color: rgba(0,0,0,.6);
        padding: 20px 0;
        float: left;
        position: absolute;
        top: 0;
        left: 0;
    }
    .door>ul>li{
        height: 42px;
        line-height: 42px;
        text-align: left;
        padding-left: 30px;
    }
    .door>ul>li>a{
        font-size: 14px;
        color: rgba(255,255,255,.6);
    }
    .door>ul>li>a>i{
        float: right;
        margin-right: 30px;
        color: rgba(255,255,255,.6);
        font-size: 14px;
    }
    .door>ul>li:hover{
        background-color: #ff6700;
    }

    .door-hidden{
        width: 992px;
        height: 460px;
        background-color: #ffffff;
        border: 1px solid #e0e0e0;
        border-left: none;
        box-shadow: 0px 8px 16px rgba(0,0,0,.18);
        position: absolute; /*父元素 door*/
        top: 0;
        left: 100%;
        display: none;
    }
    .door>ul>li:hover>.door-hidden{
        display: block;
    }

    .door-hidden>ul{
        width: 248px;
        float: left;
    }
    .door-hidden li{
        margin: 30px 20px;
    }

    .door-hidden>img{
        width: 40px;
        margin-right: 12px;
    }
    .door-hidden span{
        font-size: 14px;
        color: #333333;
    }
    /*轮播图结束*/
    /*广告样式开始*/
    .ad{
        margin-top: 14px;
        margin-bottom: 26px;
    }
    .ad-nav{
        width: 234px;
        height: 170px;
        background-color: #5f5750;
        float: left;
        padding: 3px;
        box-sizing: border-box;
    }
    .ad img{
        float: left;
        width: 316px;
        margin-left: 14.66px;
        transition: all .2s linear;
    }
    .ad img:hover{
        box-shadow: 0 15px 30px rgba(0,0,0,0.1);
    }
    .ad li{
        width: 75.3px;
        float: left;
        padding: 21.5px 0;
    }
    .ad li:nth-child(2),.ad li:nth-child(5){
        border-left: 1px solid #665e57;
        border-right: 1px solid #665e57;
    }
    .ad-nav a{
        color: rgba(255,255,255,.7);
    }
    .ad-nav a:hover{
        color: white;
    }
    .ad-nav i{
        font-size: 22px;
    }
    .ad li:nth-child(1),.ad li:nth-child(2),.ad li:nth-child(3){
        border-bottom: 1px solid #665e57;
    }
    /*广告样式结束*/
    /*小米闪购开始*/
    .xmsg{
        margin-top: 20px;
        background-color: rgb(245, 245, 245);
    }
    .container{
        position: relative;
        width: 1226px;
        margin: 57px auto ;
    }
    .flashsale{
        /*margin-bottom: 22px;*/
        position: relative;
        width: 1226px;
        height: 396px;
        margin: 0 auto 22px auto;
    }
    .box-hd{
        position: relative;
        height: 58px;
    }
    .box-hd .title{
        margin: 0;
        font-size: 22px;
        font-weight: 200;
        line-height: 58px;
        color: #333;
    }
    .box-bd{
        width: 1226px;
        height: 340px;
    }
    .row{
        margin-left: -14px;
        display: block;
        height: 340px;
    }
    .flashsale-count{
        border-top-color: #e53935;
        height: 300px;
        padding-top: 39px;
        border-top-width: 1px;
        border-top-style: solid;
        background: #f1eded;
        text-align: center;
        float: left;
        margin-left: 14px;
        min-height: 1px;
        width: 234px;
        height: 300px;
    }
    .round{
        font-size: 21px;
        color: #ef3a3b;
        padding-top: 15px;
        text-align: center;
        height: 31px;
    }
    .img{
        margin: 25px auto;
    }
    .desc{
        color: rgba(0,0,0,.54);
        font-size: 15px;
        height: 22px;
    }
    .countdown{
        width: 168px;
        margin: 28px auto 0;
    }
    .countdown span{
        width: 46px;
        height: 46px;
        background: #605751;
        color: #fff;
        font-size: 24px;
        line-height: 46px;
        float: left;
    }
    .countdown i{
        width: 15px;
        float: left;
        height: 46px;
        line-height: 46px;
        color: #605751;
        font-size: 28px;
        font-style: normal;
    }
    .layui-carousel{
        width: 978px;
        min-height: 1px;
        margin-left: 14px;
        float: left;
        height: 340px;
    }
    .layui-carousel .mi-list{
        position: relative;
        width: 100%;
        z-index: 1;
        display: flex;
    }
    .mi-item-1{
        width: 234px;
        margin-right: 14px;
        border-top-width: 1px;
        border-top-style: solid;
        text-align: center;
        background: #fff;
        transition: all .6s;
        position: relative;
        list-style: none;
        border-top-color: #e53935;
    }

    .mi-item-1 .mi-waite{
        display: block;
        height: 300px;
        padding-top: 39px;
        position: relative;
        text-decoration: none;
    }
    .mi-item-1 .mi-waite
    .mi-content{
        width: 234px;
        height: 263px;
    }
    .mi-item-1 .mi-waite
    .mi-content .mi-thumb{
        display: block;
        width: 160px;
        height: 166px;
        margin: 0 auto 22px;
    }
    .mi-item-1 .mi-waite
    .mi-content .mi-thumb img{
        width: 160px;
        height: 166px;
    }
    .mi-item-1 .mi-waite
    .mi-content .mi-title{
        margin: 0 20px 3px;
        font-size: 14px;
        font-weight: 400;
        text-overflow: ellipsis;
        color: #212121;
        overflow: hidden;
        white-space: nowrap;
    }
    .mi-item-1 .mi-waite
    .mi-content .mi-desc{
        height: 18px;
        margin: 0 20px 12px;
        font-size: 12px;
        text-overflow: ellipsis;
        color: #b0b0b0;
        overflow: hidden;
        white-space: nowrap;
    }
    .mi-item-1 .mi-waite
    .mi-content .mi-price{
        color: #ff6709;
        margin-block-start: 1em;
        margin-block-end: 1em;
        font-size: 14px;
    }
    .mi-item-1 .mi-waite
    .mi-content .mi-price  del{
        color: #b0b0b0;
    }

    /*小米闪购结束*/
    /*横幅1开始*/
    .hengfu1{
        margin-top: -58px;
        background-color: rgb(245, 245, 245);
    }
    .hf1 {
        margin-top: 20px;
    }
    /*横幅1结束*/

    /*手机开始*/
    .phone{
        margin-top: 0px;
        background-color: rgb(245, 245, 245);
    }
    .phone .top{
        height: 58px;
        line-height: 58px;
        font-size: 22px;
        font-weight: 200;
        color: #333;
    }
    .top li{
        float: right;
    }
    .top li:hover{
        color: #ff6700;
        transition: all .5s;
        cursor: pointer;
    }
    .top p{
        float: left;

    }
    .phone .body{
        height: 628px
    }

    .phone .body .phone-left{
        width: 234px;
        height: 614px;
        float: left;
    }
    .phone .phone-right{
        width: 992px;
        height: 614px;
        float: right;
    }
    .phone-right .item{
        width: 234px;
        height: 300px;
        float: left;
        background-color: rgb(255, 255, 255);
        margin-left: 13px;
        margin-bottom: 10px;
        transition: all 1s;
    }
    .phone-right .item .title{
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        font-size: 14px;
        font-weight: 400;
        color: #333;
    }
    .phone-right .item .introduce{
        text-align: center;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        margin: 0 10px 10px;
        height: 18px;
        font-size: 12px;
        color: #b0b0b0;
    }
    .phone-right .item .price{
        margin: 0 10px 14px;
        text-align: center;
        color: #ff6700;
        font-size: 14px;
    }

    .phone-right .item:hover{
        box-shadow: 0px 15px 30px rgba(0,0,0,0.5);
        /*上下浮动*/
        transition-duration: 800ms;
        transform: translate(0,-10px);
    }


    /*手机结束*/
    /*侧边导航栏开始*/
    .side-banner{
        width: 84px;
        height: 516px;
        border: #f0f0f0 1px solid;
        top: 200px;
        right: 0;
        position: fixed;
    }
    .side-banner li{
        position: relative;
        display: block;
        width: 82px;
        height: 90px;
        margin-top: -1px;
        background-color: #fff;
        border: 1px solid #f5f5f5;
    }
    .side-banner i{
        display: inline-block;
        position: absolute;
        top:20px;
        left:26px;
        font-size: 30px;
    }
    .side-banner p{
        position: absolute;
        top: 55px;
        left: 18px;
        font-size: 14px;
    }

    .side-banner li:nth-child(1):hover>.show{
        display: block;
    }
    .show {
        width: 130px;
        height: 192px;
        background-color: white;
        position: absolute; /*不占据父元素位置，就不会撑开父元素 相对于父元素li  position: relative;*/
        /*水平居中对齐*/
        top: 0;
        right: 100px;
        /*阴影*/
        box-shadow: 0 1px 5px rgb(170, 170, 170); /*水平为0，垂直为1 模糊度5px*/
        /*设置内边距*/
        padding: 18px 0 14px;
        /*避免因为内边距撑大盒子*/
        box-sizing: border-box;
        /*隐藏download*/
        display: none;
        z-index: 999;
    }
    .show >img {
        width: 90px;
        height: 90px;
    }
    .font{
        margin: 80px 0 auto;
    }

    .side-banner li:hover {
        color: #FF6700;
        transition: all .5s;
        cursor: pointer;
    }
    /*侧边导航栏结束*/
</style>


<body>
<!--黑色导航栏start-->
<div class="black-nav">
    <div class="wrap">
        <div class="black-nav-left">
            <ul>
                <li><a href="#">小米商城</a><span>|</span></li>
                <li><a href="#">MIUI</a><span>|</span></li>
                <li><a href="#">loT</a><span>|</span></li>
                <li><a href="#">云服务</a><span>|</span></li>
                <li><a href="../../banking/code/banking.html" style="color: red">金融</a><span>|</span></li>
                <li><a href="#">有品</a><span>|</span></li>
                <li><a href="../../xiaoai/code/xiaoai.html">小爱开放平台</a><span>|</span></li>
                <li><a href="#">企业团购</a><span>|</span></li>
                <li><a href="#">资质证照</a><span>|</span></li>
                <li><a href="../../agreement/code/agreement.html" style="color: red">协议规则</a><span>|</span></li>
                <li>
                    <a href="../../user/download/code/download.html" style="color: red">下载app</a><span>|</span>
                    <div class="download">
                        <img src="../../static/images/download.png" alt="">
                        <p>小米商城APP</p>
                    </div>
                </li>
                <li><a href="#">Select Location</a></li>
            </ul>
        </div>
        <div class="black-nav-right">
            <ul>
                <li><a href="../../user/login/code/login.html" style="color: red">登录</a><span>|</span></li>
                <li><a href="../../user/reg/code/reg.html" style="color: red">注册</a><span>|</span></li>
                <li class="shopping-car">
                    <a href="#">
                        <i class="iconfont icon-gouwuchekong"></i>购物车(0)
                    </a>
                    <div class="cart">购物车中还没有商品，赶紧选购吧！</div>
                </li>
            </ul>
        </div>
    </div>
</div>
<!--黑色导航栏end-->

<!--白色导航start-->
<div class="white-nav">
    <div class="wrap">
        <a href="#"><img src="/images/homepage/mi-logo.png" alt="" class="logo"></a>
        <a href="#"><img src="/images/homepage/mi-logo.gif" alt="" class="logo2"></a>
        <ul>
            <li>
                <a href="#">小米手机</a>
                <div class="nav-select">
                    <ul>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p1.png" alt="">
                                <p class="title">小米10 青春版 5G</p><!--用span行高不生效-->
                                <p class="price">1899元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p2.png" alt="">
                                <p class="title">小米10 Pro</p>
                                <p class="price">4999元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p3.png" alt="">
                                <p class="title">小米10</p>
                                <p class="price">3799元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p4.png" alt="">
                                <p class="title">小米MIX Alpha</p>
                                <p class="price">19999元起</p>
                            </a>
                        </li>
                    </ul>
                </div>
            </li>
            <li>
                <a href="#">Redmi红米</a>
                <div class="nav-select">
                    <ul>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p5.jpg" alt="">
                                <p class="title">Redmi 9A</p><!--用span行高不生效-->
                                <p class="price">499元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p6.png" alt="">
                                <p class="title">Redmi 9</p>
                                <p class="price">799元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p7.png" alt="">
                                <p class="title">Redmi 10X 4g</p>
                                <p class="price">999元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p8.png" alt="">
                                <p class="title">Redmi 10X</p>
                                <p class="price">1599元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p9.jpg" alt="">
                                <p class="title">Redmi K30 pro</p>
                                <p class="price">2499元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p10.jpg" alt="">
                                <p class="title">Redmi K30</p>
                                <p class="price">1399元起</p>
                            </a>
                        </li>
                    </ul>
                </div>
            </li>
            <li>
                <a href="#">电视</a>
                <div class="nav-select">
                    <ul>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p11.png" alt="">
                                <p class="title">小米电视 大师 65英寸OLED</p><!--用span行高不生效-->
                                <p class="price">12999元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p12.jpg" alt="">
                                <p class="title">Redmi 智能电视 MAX 98''</p>
                                <p class="price">19999元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p13.png" alt="">
                                <p class="title">小米电视4A 60英寸</p>
                                <p class="price">1999元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p14.png" alt="">
                                <p class="title">Redmi 智能电视 X55</p>
                                <p class="price">2166元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p14.png" alt="">
                                <p class="title">Redmi 红米电视 70英寸 R70A</p>
                                <p class="price">2888元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p14.png" alt="">
                                <p class="title">小米壁画电视 65英寸</p>
                                <p class="price">6999元起</p>
                            </a>
                        </li>
                    </ul>
                </div>
            </li>
            <li>
                <a href="#">笔记本</a>
                <div class="nav-select">
                    <ul>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p15.png" alt="">
                                <p class="title">RedmiBook 16</p><!--用span行高不生效-->
                                <p class="price">4699元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p16.png" alt="">
                                <p class="title">RedmiBook 14 Ⅱ</p>
                                <p class="price">4499元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p17.png" alt="">
                                <p class="title">Pro 15.6 2020款</p>
                                <p class="price">5999元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p18.png" alt="">
                                <p class="title">小米笔记本Air 13.3</p>
                                <p class="price">5499元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p19.png" alt="">
                                <p class="title">小米笔记本Air 13.3</p>
                                <p class="price">6499元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p20.png" alt="">
                                <p class="title">显示器</p>
                                <p class="price">2199元起</p>
                            </a>
                        </li>
                    </ul>
                </div>
            </li>
            <li>
                <a href="#">家电</a>
                <div class="nav-select">
                    <ul>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p21.png" alt="">
                                <p class="title">米家互联网空调C1（一级能效）</p><!--用span行高不生效-->
                                <p class="price">1999元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p22.png" alt="">
                                <p class="title">米家互联网空调（一级能效）</p>
                                <p class="price">9999元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p23.jpg" alt="">
                                <p class="title">Redmi全自动波轮洗衣机1A</p>
                                <p class="price">8499元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p24.png" alt="">
                                <p class="title">米家互联网洗烘一体机10kg</p>
                                <p class="price">2099元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p25.jpg" alt="">
                                <p class="title">米家风冷对开门冰箱 483L</p>
                                <p class="price">2269元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p26.jpg" alt="">
                                <p class="title">米家两门冰箱 160L</p>
                                <p class="price">9299元起</p>
                            </a>
                        </li>
                    </ul>
                </div>
            </li>
            <li>
                <a href="#">路由器</a>
                <div class="nav-select">
                    <ul>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p27.png" alt="">
                                <p class="title">Redmi路由器 AX5</p><!--用span行高不生效-->
                                <p class="price">249元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p28.png" alt="">
                                <p class="title">小米路由器 AX1800</p>
                                <p class="price">329元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p29.png" alt="">
                                <p class="title">小米AIoT路由器AX3600</p>
                                <p class="price">599元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p30.png" alt="">
                                <p class="title">Redmi路由器AC2100</p>
                                <p class="price">159元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p31.png" alt="">
                                <p class="title">小米路由器AC2100</p>
                                <p class="price">199元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p32.jpg" alt="">
                                <p class="title">小米路由器 Mesh</p>
                                <p class="price">799元起</p>
                            </a>
                        </li>
                    </ul>
                </div>
            </li>
            <li>
                <a href="#">智能硬件</a>
                <div class="nav-select">
                    <ul>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p33.jpg" alt="">
                                <p class="title">小米米家智能摄像机云台版</p><!--用span行高不生效-->
                                <p class="price">179元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="/images/homepage/p34.jpg" alt="">
                                <p class="title">小米小爱老师</p>
                                <p class="price">399元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p35.jpg" alt="">
                                <p class="title">小米米家智能门锁</p>
                                <p class="price">119元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p36.png" alt="">
                                <p class="title">Redmi小爱触屏音箱 8</p>
                                <p class="price">3499元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p37.jpg" alt="">
                                <p class="title">小米小爱触屏音箱</p>
                                <p class="price">119元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="#"><img src="/images/homepage/p38.png" alt="">
                                <p class="title">Redmi小爱音箱 Play</p>
                                <p class="price">79元起</p>
                            </a>
                        </li>
                    </ul>
                </div>
            </li>
            <li><a href="../../service/code/service.html" style="color: red">服务</a></li>
            <li><a href="/user/community.jsp" style="color: red">社区</a></li>
            <li>
                <form action="/api/good/selectGoodList" method="get" class="layui-form">
                <div class="box">
                    <input type="text" placeholder="洗碗机"  name="title"><!--可改进-->
                    <button   type="submit"><i class="iconfont icon-sousuo"></i></button>
                </div>
                </form>
            </li>
        </ul>
    </div>
</div>
<!--白色导航end-->

<!--轮播图开始-->
<div class="carousel">
    <div class="wrap">

        <div class="layui-carousel" id="test2" lay-filter="carofilter" style="font-size:larger">
            <div carousel-item>
                <div style=" padding: 0px; color: rgb(0, 0, 255); line-height: 1.5 !important;"><img
                        src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ac3ef452ba1527d6bf32dc2c3ffc617c.jpg?thumb=1&w=1226&h=460"
                        alt="" width="100%"></div>
                <div style=" padding: 0px; color: rgb(0, 0, 255); line-height: 1.5 !important;"><img
                        src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/cc880682e314092bd56a4c2d6b044e83.jpg?thumb=1&w=1226&h=460"
                        alt="" width="100%"></div>
                <div style=" padding: 0px; color: rgb(0, 0, 255); line-height: 1.5 !important;"><img
                        src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/ac3ef452ba1527d6bf32dc2c3ffc617c.jpg?thumb=1&w=1226&h=460"
                        alt="" width="100%"></div>
                <div style=" padding: 0px; color: rgb(0, 0, 255); line-height: 1.5 !important;"><img
                        src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/fd26f438f9046e7fe81c7c5b27649fdf.jpg?thumb=1&w=1226&h=460"
                        alt="" width="100%"></div>
                <div style=" padding: 0px; color: rgb(0, 0, 255); line-height: 1.5 !important;"><img
                        src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/cc880682e314092bd56a4c2d6b044e83.jpg?thumb=1&w=1226&h=460"
                        alt="" width="100%"></div>
            </div>
            <div class="door">
                <ul>
                    <li>
                        <a href="#">手机 电话卡<i class="iconfont icon-dayufuhao"></i></a>
                        <div class="door-hidden">
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d2.jpg" alt="">
                                        <span>Redmi 9A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d3.png" alt="">
                                        <span>Redmi 9</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d4.jpeg" alt="">
                                        <span>Redmi 10X 4G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d5.jpg" alt="">
                                        <span>Redmi 10X 5G系列</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d6.png" alt="">
                                        <span>小米10 青春版</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d7.jpg" alt="">
                                        <span>Redmi K30 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d8.jpg" alt="">
                                        <span>Redmi K30 Pro 变焦版</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d9.png" alt="">
                                        <span>腾讯黑鲨游戏手机3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d10.png" alt="">
                                        <span>腾讯黑鲨游戏手机3 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d11.png" alt="">
                                        <span>小米10 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d12.png" alt="">
                                        <span>小米10</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d13.jpg" alt="">
                                        <span>Redmi K30 4G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d14.jpg" alt="">
                                        <span>Redmi K30 5G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d15.png" alt="">
                                        <span>Redmi 8</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d16.png" alt="">
                                        <span>Redmi 8A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d17.png" alt="">
                                        <span>小米MIX Alpha</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d18.png" alt="">
                                        <span>Redmi note 8 Pro</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d19.png" alt="">
                                        <span>Redmi note 8 </span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d20.jpg" alt="">
                                        <span>Redmi 7A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d21.jpg" alt="">
                                        <span>小米移动电话卡</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d22.png" alt="">
                                        <span>手机上门维修</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d23.jpg" alt="">
                                        <span>云服务空间月卡</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d24.jpg" alt="">
                                        <span>中国电信</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li>
                        <a href="#">电视 盒子<i class="iconfont icon-dayufuhao"></i></a>
                        <div class="door-hidden">
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="./images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="./images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li>
                        <a href="#">笔记本 显示器<i class="iconfont icon-dayufuhao"></i></a>
                        <div class="door-hidden">
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d2.jpg" alt="">
                                        <span>Redmi 9A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d3.png" alt="">
                                        <span>Redmi 9</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d4.jpeg" alt="">
                                        <span>Redmi 10X 4G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d5.jpg" alt="">
                                        <span>Redmi 10X 5G系列</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d6.png" alt="">
                                        <span>小米10 青春版</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d7.jpg" alt="">
                                        <span>Redmi K30 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d8.jpg" alt="">
                                        <span>Redmi K30 Pro 变焦版</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d9.png" alt="">
                                        <span>腾讯黑鲨游戏手机3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d10.png" alt="">
                                        <span>腾讯黑鲨游戏手机3 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d11.png" alt="">
                                        <span>小米10 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d12.png" alt="">
                                        <span>小米10</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d13.jpg" alt="">
                                        <span>Redmi K30 4G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d14.jpg" alt="">
                                        <span>Redmi K30 5G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d15.png" alt="">
                                        <span>Redmi 8</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d16.png" alt="">
                                        <span>Redmi 8A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d17.png" alt="">
                                        <span>小米MIX Alpha</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d18.png" alt="">
                                        <span>Redmi note 8 Pro</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d19.png" alt="">
                                        <span>Redmi note 8 </span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d20.jpg" alt="">
                                        <span>Redmi 7A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d21.jpg" alt="">
                                        <span>小米移动电话卡</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d22.png" alt="">
                                        <span>手机上门维修</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d23.jpg" alt="">
                                        <span>云服务空间月卡</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d24.jpg" alt="">
                                        <span>中国电信</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li>
                        <a href="#">家电 插线板<i class="iconfont icon-dayufuhao"></i></a>
                        <div class="door-hidden">
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li>
                        <a href="#">出行 穿戴<i class="iconfont icon-dayufuhao"></i></a>
                        <div class="door-hidden">
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d2.jpg" alt="">
                                        <span>Redmi 9A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d3.png" alt="">
                                        <span>Redmi 9</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d4.jpeg" alt="">
                                        <span>Redmi 10X 4G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d5.jpg" alt="">
                                        <span>Redmi 10X 5G系列</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d6.png" alt="">
                                        <span>小米10 青春版</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d7.jpg" alt="">
                                        <span>Redmi K30 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d8.jpg" alt="">
                                        <span>Redmi K30 Pro 变焦版</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d9.png" alt="">
                                        <span>腾讯黑鲨游戏手机3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d10.png" alt="">
                                        <span>腾讯黑鲨游戏手机3 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d11.png" alt="">
                                        <span>小米10 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d12.png" alt="">
                                        <span>小米10</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d13.jpg" alt="">
                                        <span>Redmi K30 4G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d14.jpg" alt="">
                                        <span>Redmi K30 5G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d15.png" alt="">
                                        <span>Redmi 8</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d16.png" alt="">
                                        <span>Redmi 8A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d17.png" alt="">
                                        <span>小米MIX Alpha</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d18.png" alt="">
                                        <span>Redmi note 8 Pro</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d19.png" alt="">
                                        <span>Redmi note 8 </span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d20.jpg" alt="">
                                        <span>Redmi 7A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d21.jpg" alt="">
                                        <span>小米移动电话卡</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d22.png" alt="">
                                        <span>手机上门维修</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d23.jpg" alt="">
                                        <span>云服务空间月卡</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d24.jpg" alt="">
                                        <span>中国电信</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li>
                        <a href="#">智能 路由器<i class="iconfont icon-dayufuhao"></i></a>
                        <div class="door-hidden">
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li>
                        <a href="#">电源 配件<i class="iconfont icon-dayufuhao"></i></a>
                        <div class="door-hidden">
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d2.jpg" alt="">
                                        <span>Redmi 9A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d3.png" alt="">
                                        <span>Redmi 9</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d4.jpeg" alt="">
                                        <span>Redmi 10X 4G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d5.jpg" alt="">
                                        <span>Redmi 10X 5G系列</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d6.png" alt="">
                                        <span>小米10 青春版</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d7.jpg" alt="">
                                        <span>Redmi K30 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d8.jpg" alt="">
                                        <span>Redmi K30 Pro 变焦版</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d9.png" alt="">
                                        <span>腾讯黑鲨游戏手机3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d10.png" alt="">
                                        <span>腾讯黑鲨游戏手机3 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d11.png" alt="">
                                        <span>小米10 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d12.png" alt="">
                                        <span>小米10</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d13.jpg" alt="">
                                        <span>Redmi K30 4G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d14.jpg" alt="">
                                        <span>Redmi K30 5G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d15.png" alt="">
                                        <span>Redmi 8</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d16.png" alt="">
                                        <span>Redmi 8A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d17.png" alt="">
                                        <span>小米MIX Alpha</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d18.png" alt="">
                                        <span>Redmi note 8 Pro</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d19.png" alt="">
                                        <span>Redmi note 8 </span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d20.jpg" alt="">
                                        <span>Redmi 7A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d21.jpg" alt="">
                                        <span>小米移动电话卡</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d22.png" alt="">
                                        <span>手机上门维修</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d23.jpg" alt="">
                                        <span>云服务空间月卡</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d24.jpg" alt="">
                                        <span>中国电信</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li>
                        <a href="#">健康 儿童<i class="iconfont icon-dayufuhao"></i></a>
                        <div class="door-hidden">
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="./images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li>
                        <a href="#">耳机 音箱<i class="iconfont icon-dayufuhao"></i></a>
                        <div class="door-hidden">
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d2.jpg" alt="">
                                        <span>Redmi 9A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d3.png" alt="">
                                        <span>Redmi 9</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d4.jpeg" alt="">
                                        <span>Redmi 10X 4G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d5.jpg" alt="">
                                        <span>Redmi 10X 5G系列</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d6.png" alt="">
                                        <span>小米10 青春版</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d7.jpg" alt="">
                                        <span>Redmi K30 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d8.jpg" alt="">
                                        <span>Redmi K30 Pro 变焦版</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d9.png" alt="">
                                        <span>腾讯黑鲨游戏手机3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d10.png" alt="">
                                        <span>腾讯黑鲨游戏手机3 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d11.png" alt="">
                                        <span>小米10 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d12.png" alt="">
                                        <span>小米10</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d13.jpg" alt="">
                                        <span>Redmi K30 4G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d14.jpg" alt="">
                                        <span>Redmi K30 5G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d15.png" alt="">
                                        <span>Redmi 8</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d16.png" alt="">
                                        <span>Redmi 8A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d17.png" alt="">
                                        <span>小米MIX Alpha</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d18.png" alt="">
                                        <span>Redmi note 8 Pro</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d19.png" alt="">
                                        <span>Redmi note 8 </span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d20.jpg" alt="">
                                        <span>Redmi 7A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d21.jpg" alt="">
                                        <span>小米移动电话卡</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d22.png" alt="">
                                        <span>手机上门维修</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d23.jpg" alt="">
                                        <span>云服务空间月卡</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d24.jpg" alt="">
                                        <span>中国电信</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li>
                        <a href="#">生活 箱包<i class="iconfont icon-dayufuhao"></i></a>
                        <div class="door-hidden">
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d1.png" alt="">
                                        <span>腾讯黑鲨手机S3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d2.jpg" alt="">
                                        <span>Redmi 9A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d3.png" alt="">
                                        <span>Redmi 9</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d4.jpeg" alt="">
                                        <span>Redmi 10X 4G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d5.jpg" alt="">
                                        <span>Redmi 10X 5G系列</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d6.png" alt="">
                                        <span>小米10 青春版</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d7.jpg" alt="">
                                        <span>Redmi K30 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d8.jpg" alt="">
                                        <span>Redmi K30 Pro 变焦版</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d9.png" alt="">
                                        <span>腾讯黑鲨游戏手机3</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d10.png" alt="">
                                        <span>腾讯黑鲨游戏手机3 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d11.png" alt="">
                                        <span>小米10 Pro</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d12.png" alt="">
                                        <span>小米10</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d13.jpg" alt="">
                                        <span>Redmi K30 4G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d14.jpg" alt="">
                                        <span>Redmi K30 5G</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d15.png" alt="">
                                        <span>Redmi 8</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d16.png" alt="">
                                        <span>Redmi 8A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d17.png" alt="">
                                        <span>小米MIX Alpha</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d18.png" alt="">
                                        <span>Redmi note 8 Pro</span>
                                    </a>
                                </li>
                            </ul>
                            <ul>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d19.png" alt="">
                                        <span>Redmi note 8 </span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d20.jpg" alt="">
                                        <span>Redmi 7A</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d21.jpg" alt="">
                                        <span>小米移动电话卡</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d22.png" alt="">
                                        <span>手机上门维修</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d23.jpg" alt="">
                                        <span>云服务空间月卡</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <img src="/images/homepage/d24.jpg" alt="">
                                        <span>中国电信</span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

<!--轮播图结束-->
<!--广告开始-->
<div class="ad">
    <div class="wrap">
        <div class="ad-nav">
            <ul>
                <li>
                    <a href="#">
                        <i class="iconfont icon-miaosha"></i>
                        <br/>
                        <span>小米秒杀</span>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class="iconfont icon-icon-test"></i>
                        <br/>
                        <span>企业团购</span>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class="iconfont icon-F"></i>
                        <br/>
                        <span>F码通道</span>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class="iconfont icon-ai-SIM"></i>
                        <br/>
                        <span>米粉卡</span>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class="iconfont icon-xin"></i>
                        <br/>
                        <span>以旧换新</span>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <i class="iconfont icon-chongzhi"></i>
                        <br/>
                        <span>话费充值</span>
                    </a>
                </li>
            </ul>
        </div>
        <img src="/images/homepage/e1.jpg" alt=""/>
        <img src="/images/homepage/e2.jpg" alt=""/>
        <img src="/images/homepage/e3.jpg" alt=""/>
    </div>
</div>
<!--广告结束-->
<div style="height: 100px"></div>
<!--小米闪购开始-->
<div class="xmsg">
    <div class="container">
        <div class="flashsale">
            <div class="box-hd">
                <h2 class="title">小米闪购</h2>
            </div>
            <div class="box-bd">
                <div class="row">
                    <div class="flashsale-count">
                        <div class="round">12:00场</div>
                        <img src="/images/homepage/temp.png" alt="" class="img">
                        <div class="desc">距离结束还有</div>
                        <div class="countdown">
                            <span id="mi-hour"></span>
                            <i>:</i>
                            <span id="mi-minute"></span>
                            <i>:</i>
                            <span id="mi-second"></span>
                        </div>
                    </div>
                    <div class="layui-carousel" id="test1" lay-filter="carofilter" style="font-size:larger">
                        <div carousel-item>
                            <div>
                                <ul class="mi-list">
                                    <li class="mi-item-1">
                                        <a href="" class="mi-waite">
                                            <div class="mi-content">
                                                <div class="mi-thumb">
                                                    <img src="/images/homepage/b315ba2c-3dc0-1352-3fbf-b23ffad1bb0f.jpg"
                                                         alt="">
                                                </div>
                                                <h3 class="mi-title">米家吸顶灯 卧室吸顶灯</h3>
                                                <p class="mi-desc">开启全屋智能照明时代</p>
                                                <p class="mi-price">
                                                    <span class="mi-span">229</span>元
                                                    <del>249元</del>
                                                </p>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="mi-item-1">
                                        <a href="" class="mi-waite">
                                            <div class="mi-content">
                                                <div class="mi-thumb">
                                                    <img src="/images/homepage/b315ba2c-3dc0-1352-3fbf-b23ffad1bb0f.jpg"
                                                         alt="">
                                                </div>
                                                <h3 class="mi-title">米家吸顶灯 卧室吸顶灯</h3>
                                                <p class="mi-desc">开启全屋智能照明时代</p>
                                                <p class="mi-price">
                                                    <span class="mi-span">229</span>元
                                                    <del>249元</del>
                                                </p>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="mi-item-1">
                                        <a href="" class="mi-waite">
                                            <div class="mi-content">
                                                <div class="mi-thumb">
                                                    <img src="/images/homepage/b315ba2c-3dc0-1352-3fbf-b23ffad1bb0f.jpg"
                                                         alt="">
                                                </div>
                                                <h3 class="mi-title">米家吸顶灯 卧室吸顶灯</h3>
                                                <p class="mi-desc">开启全屋智能照明时代</p>
                                                <p class="mi-price">
                                                    <span class="mi-span">229</span>元
                                                    <del>249元</del>
                                                </p>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="mi-item-1">
                                        <a href="" class="mi-waite">
                                            <div class="mi-content">
                                                <div class="mi-thumb">
                                                    <img src="/images/homepage/b315ba2c-3dc0-1352-3fbf-b23ffad1bb0f.jpg"
                                                         alt="">
                                                </div>
                                                <h3 class="mi-title">米家吸顶灯 卧室吸顶灯</h3>
                                                <p class="mi-desc">开启全屋智能照明时代</p>
                                                <p class="mi-price">
                                                    <span class="mi-span">229</span>元
                                                    <del>249元</del>
                                                </p>
                                            </div>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                            <div>
                                <ul class="mi-list">
                                    <li class="mi-item-1">
                                        <a href="" class="mi-waite">
                                            <div class="mi-content">
                                                <div class="mi-thumb">
                                                    <img src="/images/homepage/pms_1589945613.22046687.jpg" alt="">
                                                </div>
                                                <h3 class="mi-title">圈厨多用途电热锅 白色</h3>
                                                <p class="mi-desc">煎烤烙炖蒸焖涮，样样精通</p>
                                                <p class="mi-price">
                                                    <span class="mi-span">169</span>元
                                                    <del>1999元</del>
                                                </p>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="mi-item-1">
                                        <a href="" class="mi-waite">
                                            <div class="mi-content">
                                                <div class="mi-thumb">
                                                    <img src="/images/homepage/pms_1589945613.22046687.jpg" alt="">
                                                </div>
                                                <h3 class="mi-title">圈厨多用途电热锅 白色</h3>
                                                <p class="mi-desc">煎烤烙炖蒸焖涮，样样精通</p>
                                                <p class="mi-price">
                                                    <span class="mi-span">169</span>元
                                                    <del>1999元</del>
                                                </p>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="mi-item-1">
                                        <a href="" class="mi-waite">
                                            <div class="mi-content">
                                                <div class="mi-thumb">
                                                    <img src="/images/homepage/pms_1589945613.22046687.jpg" alt="">
                                                </div>
                                                <h3 class="mi-title">圈厨多用途电热锅 白色</h3>
                                                <p class="mi-desc">煎烤烙炖蒸焖涮，样样精通</p>
                                                <p class="mi-price">
                                                    <span class="mi-span">169</span>元
                                                    <del>1999元</del>
                                                </p>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="mi-item-1">
                                        <a href="" class="mi-waite">
                                            <div class="mi-content">
                                                <div class="mi-thumb">
                                                    <img src="/images/homepage/pms_1589945613.22046687.jpg" alt="">
                                                </div>
                                                <h3 class="mi-title">圈厨多用途电热锅 白色</h3>
                                                <p class="mi-desc">煎烤烙炖蒸焖涮，样样精通</p>
                                                <p class="mi-price">
                                                    <span class="mi-span">169</span>元
                                                    <del>1999元</del>
                                                </p>
                                            </div>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                            <div>
                                <ul class="mi-list">
                                    <li class="mi-item-1">
                                        <a href="" class="mi-waite">
                                            <div class="mi-content">
                                                <div class="mi-thumb">
                                                    <img src="/images/homepage/computer.jpg" alt="">
                                                </div>
                                                <h3 class="mi-title">小米曲面显示器 34英寸 黑</h3>
                                                <p class="mi-desc">超宽大环绕显示屏</p>
                                                <p class="mi-price">
                                                    <span class="mi-span">2199</span>元
                                                    <del>2499元</del>
                                                </p>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="mi-item-1">
                                        <a href="" class="mi-waite">
                                            <div class="mi-content">
                                                <div class="mi-thumb">
                                                    <img src="/images/homepage/computer.jpg" alt="">
                                                </div>
                                                <h3 class="mi-title">小米曲面显示器 34英寸 黑</h3>
                                                <p class="mi-desc">超宽大环绕显示屏</p>
                                                <p class="mi-price">
                                                    <span class="mi-span">2199</span>元
                                                    <del>2499元</del>
                                                </p>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="mi-item-1">
                                        <a href="" class="mi-waite">
                                            <div class="mi-content">
                                                <div class="mi-thumb">
                                                    <img src="/images/homepage/computer.jpg" alt="">
                                                </div>
                                                <h3 class="mi-title">小米曲面显示器 34英寸 黑</h3>
                                                <p class="mi-desc">超宽大环绕显示屏</p>
                                                <p class="mi-price">
                                                    <span class="mi-span">2199</span>元
                                                    <del>2499元</del>
                                                </p>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="mi-item-1">
                                        <a href="" class="mi-waite">
                                            <div class="mi-content">
                                                <div class="mi-thumb">
                                                    <img src="/images/homepage/computer.jpg" alt="">
                                                </div>
                                                <h3 class="mi-title">小米曲面显示器 34英寸 黑</h3>
                                                <p class="mi-desc">超宽大环绕显示屏</p>
                                                <p class="mi-price">
                                                    <span class="mi-span">2199</span>元
                                                    <del>2499元</del>
                                                </p>
                                            </div>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="mi-controls"></div>
                </div>
            </div>
        </div>
    </div>
</div>

<!--小米闪购结束-->
<!--横幅1开始-->
<div class="hengfu1">
    <div class="wrap">
        <img src="/images/homepage/hengfu1.jpg" alt="" class="hf1">
    </div>
</div>
<!--横幅1结束-->

<!--手机开始-->
<div class="phone">
    <div class="wrap">
        <div class="top">
            <ul>
                <p>手机</p>
                <li>
                    查看全部
                    <i class="iconfont icon-rightarrow"></i>
                </li>
            </ul>
        </div>
        <div class="body">
            <ul>
                <li>
                    <a href="#">
                        <img src="/images/homepage/phone1.jpg" alt="" class="phone-left">
                    </a>
                </li>
                <li>
                    <ul class="phone-right">
                        <li class="item">
                            <a href="#">
                                <img src="/images/homepage/phone2.jpg" alt="">
                                <p class="title">腾讯黑鲨3S</p>
                                <p class="introduce">骁龙865处理器，120hz刷新率</p>
                                <p class="price">3999元起</p>
                            </a>
                        </li>
                        <li class="item">
                            <a href="#">
                                <img src="/images/homepage/phone2.jpg" alt="">
                                <p class="title">腾讯黑鲨3S</p>
                                <p class="introduce">骁龙865处理器，120hz刷新率</p>
                                <p class="price">3999元起</p>
                            </a>
                        </li>
                        <li class="item">
                            <a href="#">
                                <img src="/images/homepage/phone2.jpg" alt="">
                                <p class="title">腾讯黑鲨3S</p>
                                <p class="introduce">骁龙865处理器，120hz刷新率</p>
                                <p class="price">3999元起</p>
                            </a>
                        </li>
                        <li class="item">
                            <a href="#">
                                <img src="/images/homepage/phone2.jpg" alt="">
                                <p class="title">腾讯黑鲨3S</p>
                                <p class="introduce">骁龙865处理器，120hz刷新率</p>
                                <p class="price">3999元起</p>
                            </a>
                        </li>
                        <li class="item">
                            <a href="#">
                                <img src="/images/homepage/phone2.jpg" alt="">
                                <p class="title">腾讯黑鲨3S</p>
                                <p class="introduce">骁龙865处理器，120hz刷新率</p>
                                <p class="price">3999元起</p>
                            </a>
                        </li>
                        <li class="item">
                            <a href="#">
                                <img src="/images/homepage/phone2.jpg" alt="">
                                <p class="title">腾讯黑鲨3S</p>
                                <p class="introduce">骁龙865处理器，120hz刷新率</p>
                                <p class="price">3999元起</p>
                            </a>
                        </li>
                        <li class="item">
                            <a href="#">
                                <img src="/images/homepage/phone2.jpg" alt="">
                                <p class="title">腾讯黑鲨3S</p>
                                <p class="introduce">骁龙865处理器，120hz刷新率</p>
                                <p class="price">3999元起</p>
                            </a>
                        </li>
                        <li class="item">
                            <a href="#">
                                <img src="/images/homepage/phone2.jpg" alt="">
                                <p class="title">腾讯黑鲨3S</p>
                                <p class="introduce">骁龙865处理器，120hz刷新率</p>
                                <p class="price">3999元起</p>
                            </a>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>
</div>
<!--手机结束-->

<!--侧边导航栏开始-->
<div class="side-banner">
    <ul>
        <li>
            <i class="iconfont icon-shouji"></i>
            <p>手机app</p>
            <div class="show">
                <img src="/images/homepage/download.png" alt="">
                <p class="font">扫码领取<br>新人百元红包</p>
            </div>
        </li>
        <li>
            <i class="iconfont icon-gerenzhongxin"></i>
            <p>个人中心</p>
        </li>
        <li>
            <i class="iconfont icon-banshou"></i>
            <p>售后服务</p>
        </li>
        <li>
            <i class="iconfont icon-service"></i>
            <p>人工服务</p>
        </li>
        <li>
            <i class="iconfont icon-gouwuchekong"></i>
            <p>购物车</p>
        </li>
    </ul>
</div>
<!--侧边导航栏结束-->


<script src="/static/layui/layui.all.js"></script>
<script src="/static/js/jquery.min.js"></script>

<!-- 条目中可以是任意内容，如：<img src=""> -->
<script>
    layui.use('carousel', function () {
        var carousel = layui.carousel;
        //***************************建造实例
        var ins = carousel.render({
            elem: '#test2'
            , width: '1250px'     //设置容器宽度
            , height: '460px'
            , arrow: 'always'    //始终显示箭头，可选hover,none
            //,anim: 'updown'    //切换动画方式，可选fade,default
            , full: false        //全屏
            , autoplay: true     //自动切换
            , interval: 1000     //自动切换的时间间隔
            , index: 3           //初始化时item索引,默认时0
            , indicator: 'inside' //指示器位置，可选outside,none
        });

        //**************************监听轮播切换事件
        carousel.on('change(carofilter)', function (obj) { //test1来源于对应HTML容器的 lay-filter="test1" 属性值
            console.log(obj.index);     //当前条目的索引
            console.log(obj.prevIndex); //上一个条目的索引
            console.log(obj.item);      //当前条目的元素对象
        });

        //****************************重置轮播
        //var ins = carousel.render(options);
        ins.reload({arrow: 'hover'});//将arror从alway变成hover
    });
</script>

<script>

    setInterval(function () {
        let hour = new Date().getHours();
        let minute = new Date().getMinutes();
        let second = new Date().getSeconds();
        second = 60 - second;
        if (second > 0 && minute !== 60) {
            minute = 59 - minute;
        } else if (minute === 60) {
            minute = 0;
        }
        if (minute > 0 && hour !== 24) {
            hour = 23 - hour;
        } else if (hour === 24) {
            hour = 0;
        }
        if (second < 10) {
            second = '0' + second;
        }
        if (minute < 10) {
            minute = '0' + minute;
        }
        if (hour < 10) {
            hour = '0' + hour;
        }
        document.getElementById('mi-hour').innerHTML = hour;
        document.getElementById('mi-minute').innerText = minute;
        document.getElementById('mi-second').innerText = second;
    }, 1000)

    layui.use('carousel', function () {
        var carousel = layui.carousel;
        //***************************建造实例
        var ins = carousel.render({
            elem: '#test1'
            , width: '978px'     //设置容器宽度
            , height: '350px'
            , arrow: 'hover'    //始终显示箭头，可选hover,none
            //,anim: 'updown'    //切换动画方式，可选fade,default
            , full: false        //全屏
            , autoplay: true    //自动切换
            , interval: 1000     //自动切换的时间间隔
            , index: 0          //初始化时item索引,默认时0
            , indicator: 'none' //指示器位置，可选outside,none
        });
    });
</script>
</body>
</html>
